<div>
  <label>Hero ID:
    <input [(ngModel)]="student.id" />
  </label>
  <br>
  <label>Hero name:
    <input [(ngModel)]="student.name" />
  </label>
  <br>
  <label>Hero gender:
    <input [(ngModel)]="student.gender" />
  </label>
  <br>
  <label>Hero degree:
    <input [(ngModel)]="student.degree" />
  </label>
  <br>
  <label>Hero tel:
    <input [(ngModel)]="student.tel" />
  </label>
  <br>
  <label>Hero born:
    <input [(ngModel)]="student.born" />
  </label>
  <br>
  <label>Hero addr:
    <input [(ngModel)]="student.addr" />
  </label>
  <br>
  <button (click)="onOperate()">
    保存
  </button>
</div>

<div>
  <button (click)="onList()">
    查看
  </button>
</div>
<ul>
  <li>
    <table border="1">
      <tr>
        <th>ID</th>
        <th>姓名</th>
        <th>性别</th>
        <th>生日</th>
        <th>电话号码</th>
        <th>学位</th>
        <th>地址</th>
        <th>操作</th>
      </tr>
      <tr *ngFor="let student of students">
        <td>{{student.id}}</td>
        <td>{{student.name}}</td>
        <td>{{student.gender}}</td>
        <td>{{student.born}}</td>
        <td>{{student.tel}}</td>
        <td>{{student.degree}}</td>
        <td>{{student.addr}}</td>
        [<button (click)="onDelete(student.id)">x</button>]
        [<button (click)="onGet(student.id)">修改</button>]
      </tr>
    </table>
  </li>
</ul>
